<template>
    <el-form :model="baseFrom" :rules="baseFromRules" ref="ruleForm" label-width="110px" class="GO-store-form">
        <el-form-item label="门店编号" prop="storeId" class="form-item-number">
            <el-row v-if="loaded">
                <el-col :span="11">
                    <el-select v-model="baseFrom.storeId" placeholder="请选择门店" @change="changeStore">
                        <el-option v-for="(item, index) in storeList" :label="item.storeCode" :value="item.id" :key="index"></el-option>
                    </el-select>
                </el-col>
                <el-col :span="12" :offset="1">
                    <el-input class="shop-name" v-model="baseFrom.name" disabled></el-input>
                </el-col>
            </el-row>
        </el-form-item>
<!--        <el-form-item label="面料来源" required>-->
<!--            <el-radio-group v-model="baseFrom.fabricSource" @change="saveBaseFrom">-->
<!--                <el-radio-button :label="item.dataname" v-for="(item, index) in fabricSourceList" :key="index">{{ item.dataname }} </el-radio-button>-->
<!--            </el-radio-group>-->
<!--        </el-form-item>-->
        <el-form-item label="业务类型" required>
            <el-radio-group v-model="baseFrom.businessSource" @change="saveBaseFrom">
                <el-radio-button :label="item.dataname" v-for="(item, index) in businessSourceList" :key="index">{{ item.dataname }} </el-radio-button>
            </el-radio-group>
        </el-form-item>
        <el-form-item label="选择包装" required>
            <el-radio-group v-model="baseFrom.packageType" @change="saveBaseFrom">
                <el-radio-button :label="item.dataname" v-for="(item, index) in packageTypeList" :key="index">{{ item.dataname }} </el-radio-button>
            </el-radio-group>
        </el-form-item>

        <el-form-item label="快递方式" required>
            <el-radio-group v-model="baseFrom.courierId" @change="saveBaseFrom">
                <el-radio-button :label="item.id" v-for="(item, index) in courierList" :key="index">
                    {{ item.courierName }}
                </el-radio-button>
            </el-radio-group>
        </el-form-item>
        <el-form-item label="地址类型" required>
            <el-radio-group v-model="baseFrom.addressType" @change="changeAddressType">
                <el-radio-button :label="1" style=" border: 1px solid rgba(242, 242, 242, 1);
                    border-radius: 5px;

                    color: #9d9d9d;
                    width: 150px;
                    font-weight: 400;">门店地址</el-radio-button>
                <el-radio-button :label="2">其他地址</el-radio-button>
            </el-radio-group>
        </el-form-item>
        <el-form-item label="收货地址" class="form-item-number" required>
            <el-row>
                <el-col :span="18">
                    <el-input :disabled="baseFrom.addressType == 1" v-model="baseFrom.address" @change="saveBaseFrom"></el-input>
                </el-col>
            </el-row>
        </el-form-item>
<!--        <el-form-item label="模版名称" prop="orderName">-->
<!--            <el-row>-->
<!--                <el-col :span="11">-->
<!--                    <el-input v-model="baseFrom.orderName" @change="changeAddressType"></el-input>-->
<!--                </el-col>-->
<!--            </el-row>-->
<!--        </el-form-item>-->
    </el-form>
</template>

<script>
    let storage = window.localStorage;
      import {getAction,postAction} from "../../../api/manage";
    import { query_dataBytype, query_allCourier, query_allstore_companyId } from '@/api/group-order';

    export default {
        name: 'storePane',
        data() {
            return {
				orderSn:storage.getItem('orderSn'),
                loaded: false,
                //店铺列表
                storeList: [],
                //面料列表
                fabricSourceList: [],
                //业务类型列表
                businessSourceList: [],
                //包装类型列表
                packageTypeList: [],
                //快递列表
                courierList: [],
                // 当前门店
                curStore: null,
                baseFrom: {
                    storeId: 1,
                    storeCode: '',
                    orderName: '',
                    fabricSource: '1',
                    businessSource: '2',
                    packageType: '1',
                    courierId: '2',
                    addressType: '1',
                    address: '',
                    orderId: ''
                },
                baseFromRules: {},
				url:{
					storeDetail:"/Businesswater/getstoreDetailByorderSn"
				}
            };
        },
        created() {
		
            let that = this;
            Promise.all([
                // 获取门店
                query_allstore_companyId({
                    token: storage.getItem('token')
				
                }).then(res => {
                    if (res.status === 200) {
                        let getData = res.data.data;
                        getData.forEach((v, i) => {
                            if (i === 0) {
                                that.baseFrom.storeId = v.id;
                                that.baseFrom.storeCode = v.storeCode;
                                that.baseFrom.name = v.storeName;
                                that.baseFrom.address = v.storeAddress;
                                that.curStore = v;
                            }
                            that.storeList.push(v);
                        });
                        that.loaded = true;
                    }
                }),
				
                // 获取面料
                query_dataBytype({ type: 1 }).then(res => {
                    if (res.status === 200) {
                        let getData = res.data.data;
                        getData.forEach((v, i) => {
                            if (i === 0) {
                                that.baseFrom.fabricSource = v.dataname;
                            }
                            that.fabricSourceList.push(v);
                        });
                    }
                }),
                // 获取业务类型
                query_dataBytype({ type: 2 }).then(res => {
                    if (res.status === 200) {
                        let getData = res.data.data;
                        getData.forEach((v, i) => {
                            if (i === 0) {
                                that.baseFrom.businessSource = v.dataname;
                            }
                            that.businessSourceList.push(v);
                        });
                    }
                }),
                // 获取包装类型
                query_dataBytype({ type: 3 }).then(res => {
                    if (res.status === 200) {
                        let getData = res.data.data;
                        getData.forEach((v, i) => {
                            if (i === 0) {
                                that.baseFrom.packageType = v.dataname;
                            }
                            that.packageTypeList.push(v);
                        });
                    }
                }),
                // 获取快递类型
                query_allCourier().then(res => {
                    if (res.status === 200) {
                        let getData = res.data.data;
                        getData.forEach((v, i) => {
                            if (i === 0) {
                                that.baseFrom.courierId = v.id;
                            }
                            that.courierList.push(v);
                        });
                    }
                })
            ]).then(() => {
                let storageBaseFrom = storage.getItem('groupOrder_baseFrom');

                if (storageBaseFrom) {
                    storageBaseFrom = JSON.parse(storageBaseFrom);
                    for (let k in storageBaseFrom) {
                        that.baseFrom[k] = storageBaseFrom[k];
                    }
                } else {
                    storage.setItem('groupOrder_baseFrom', JSON.stringify(that.baseFrom));
                }
            });
			
			this.getstoreDetailByorderSn(this.orderSn);
        },
        methods: {
			
			getstoreDetailByorderSn(orderSn){
				getAction(domain.publicUrl + this.url.storeDetail, {
					'orderSn':orderSn
				}).then(res => {
				 if(res.code==0){
					 that.baseFrom.storeId = res.data.id;
					 that.baseFrom.storeCode = res.data.storeCode;
					 that.baseFrom.name = res.data.storeName;
					 that.baseFrom.address = res.data.storeAddress;
				 }
				})
			},
			
            /**
             * @Date: 2020-10-31 14:02:19
             * @LastEditors: qwguo
             * @description: 更改店铺方法
             * @param {type} 参数说明
             * @return: 返回值
             */
            changeStore(id) {
                let getItem = this.storeList.find(v => {
                    return v.id === id;
                });
                this.curStore = getItem;
                this.baseFrom.name = getItem.storeName;
                this.baseFrom.address = getItem.storeAddress;
                this.baseFrom.storeCode = getItem.storeCode;
                this.saveBaseFrom();
            },
            changeAddressType(id) {
                let that = this;
                switch (id * 1) {
                    case 1:
                        that.baseFrom.address = that.curStore.storeAddress;
                        break;
                    case 2:
                        that.baseFrom.address = '';
                        break;
                }
                that.saveBaseFrom();
            },
            /**
             * @Date: 2020-11-10 23:48:23
             * @LastEditors: qwguo
             * @description: 存储数据到本地
             * @param {type} 参数说明
             * @return: 返回值
             */
            saveBaseFrom() {
                storage.setItem('groupOrder_baseFrom', JSON.stringify(this.baseFrom));
            }
        }
    };
</script>

<style lang="scss">
    .GO-store-form {
        .el-radio-group {
            .el-radio-button {
                margin: 0 10px 10px 0;

                .el-radio-button__inner {
                    border: 1px solid rgba(242, 242, 242, 1);
                    border-radius: 5px;
                    padding: 12px 0;
                    color: #9d9d9d;
                    width: 150px;
                    font-weight: 400;
                }

                &:hover {
                    .el-radio-button__inner {
                        box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.129411764705882);
                        border-radius: 5px;
                        color: rgb(74, 74, 74);
                        font-weight: 700;
                    }
                }

                &.is-active {
                    .el-radio-button__inner {
                        background-color: rgba(255, 236, 112, 1);
                        color: rgb(74, 74, 74);
                        box-shadow: none;
                        font-weight: 700;
                    }
                }
            }
        }

        .form-item-number {
            .el-select {
                width: 100%;
            }
        }
    }
</style>
